<template>
	<div class="app-container">
		<div class="row">
			<span class="left-label">项目名称</span>
			<el-input v-model="queryData.projectName" style="width: 200px; margin-right: 20px" placeholder="请输入项目名称" />

			<span class="left-label">项目编号</span>
			<el-input v-model="queryData.projectCode" style="width: 350px; margin-right: 20px" placeholder="请输入项目编号" />
			<span class="left-label" style="margin-left: 20px">姓名</span>
			<el-input v-model="queryData.nickName" style="width: 350px; margin-right: 20px" placeholder="请输入姓名" />
			<el-button type="primary" @click="search" style="margin-left: 10px">搜索</el-button>
			<el-button @click="exportP">导出</el-button>
		</div>
		<BaseTable :columns="columns" :dataList="dataList">
			<template #procureName="{ row }">
				<span style="cursor: pointer; color: #409eff" @click="toDetail(row.procureId)">{{ row.procureName }}</span>
			</template>
		</BaseTable>
		<pagination :total="total" v-model:page="queryData.pageNum" v-model:limit="queryData.pageSize" @pagination="search" />
	</div>
</template>
<script setup>
import { reactive } from 'vue'
import BaseTable from '@/components/BaseTable'
import { listProcure } from '@/api/buy/buy'
import { listProjectSummary } from '@/api/project/project'

const { proxy } = getCurrentInstance()
const { project_category } = proxy.useDict('project_category')
const router = useRouter()
import useUserStore from '@/store/modules/user'
const userStore = useUserStore()
console.log(userStore.$state.roles)
const queryData = reactive({
	pageNum: 1,
	pageSize: 100,
	projectName: undefined,
	projectCode: undefined,
	projectCategory: undefined
})
const columns = ref([
	{ key: 1, width: '120', label: `角色`, prop: 'roleName', type: 'text', visible: true },
	{ key: 2, width: '80', label: `姓名`, prop: 'nickName', type: 'text', visible: true },
	{ key: 3, minWidth: '220', label: `项目名称`, prop: 'projectName', type: 'text', visible: true },
	{ key: 4, width: '100', label: `项目编号`, prop: 'projectCode', type: 'text', visible: true },
	{ key: 5, width: '60', label: `年`, prop: 'year', type: 'text', visible: true },
	{ key: 6, width: '50', label: `月`, prop: 'month', type: 'text', visible: true },
	{ key: 7, width: '50', label: `日`, prop: 'day', type: 'text', visible: true },
	{ key: 8, width: '90', label: `周`, prop: 'week', type: 'text', visible: true },
	{ key: 9, width: '120', label: `类型名称`, prop: 'logTypeName', type: 'text', visible: true },
	{ key: 10, width: '120', label: `分类名称`, prop: 'logCategoryName', type: 'text', visible: true }
])
const total = ref(0)
const dataList = ref([])
const search = () => {
	console.log(queryData, 'queryData')
	listProjectSummary(queryData).then((res) => {
		dataList.value = res.rows
		total.value = res.total
	})
}
const exportP = () => {
	proxy.download('/function/project/summary/export', {}, `汇总表.xlsx`)
}

const toDetail = (id) => {
	router.push({
		path: '/buy/buyDetail',
		query: { id: id }
	})
}
const toEdit = (id) => {
	router.push({
		path: '/buy/buyEdit',
		query: { id: id }
	})
}

search()
</script>
<style lang="scss" scoped>
.row {
	border-bottom: 1px rgba(240, 240, 240, 1) solid;
	padding: 5px 0 10px 0;
	.left-label {
		color: #33b6fe;
		height: 24px;
		line-height: 24px;
		position: relative;
		top: 1px;
		margin-right: 0px;
		display: inline-block;
		min-width: 60px;
		margin-left: 10px;
	}
}
</style>
